<?=$this->load->view('user_include_top',null)?>  
<?
    function show_countries_by_area(&$countries, $area_name, $index=1) {
        $i = 1;
        $more = "";
        foreach($countries as $v){
            if($v['area_name'] == $area_name) {
                $name = $v['cn_name'];
                if($v['is_schengen'] == 1) $name.='[<font color=green>申</font>]';
                $str = "<span class='item' onclick=\"javascript:select_country(".$v['id'].",'".$v['cn_name']."', '".$v['short_name']."', ".$v['is_schengen'].");\">".$name."</span>　"; 
                if($i++ < 11) {
                   echo $str;
                }  else {
                   $more .= $str;  // 超过10个的，显示在更多中   
                   if($i%10 == 0) $more .= "<br>"; 
                }
            } 
        }
        if($more != "") {
            echo "[<span class='item' style='color:red' onclick='show_more_countries($index, this)'>更多</span>]";   
            echo "<div id='more_countries_{$index}' style='display:none;'>$more</div>";
        } 
    }
    
    if(isset($_GET['id'])) {  // 从首页传入的指定参数
        $_SESSION['visa_type'] = 'one';   
        $_SESSION['country_ids'] = $_GET['id']; 
        $_SESSION['country_cn_names'] = $_GET['cn_name'];    
        $_SESSION['country_short_names'] = $_GET['short_name'];    
    }
?>
<script type="text/javascript" src="js/jquery.autocomplete.pack.js"></script>
<link type="text/css" rel="stylesheet" href="css/jquery.autocomplete.css"/>
<style> .item {color:#05a; cursor:pointer;} </style>
<div style="width:100%;padding:5px; text-align: center;">  
<form name="form">

                     <TABLE cellSpacing=1 style="width:100%" cellspacing="8">
                        <tr><td bgcolor="#eeeeee">
                        户口或暂住地：<select id='province_name'>
                            <?
                            foreach($provinces as $v) {
                                $k = $v['province_name'];
                                $is_selected = ($_SESSION['province_name'] == "$k") ? 'selected' : '';  
                                echo "<option value='$k' $is_selected>$k</option>";
                            }
                            ?> 
                            </select>　　
                            签证类别：<select id='visa_type' onchange="clear_selected()">
                            <?
                            foreach($visa_type_array as $k=>$v) {
                                $is_selected = ($_SESSION['visa_type'] == "$k") ? 'selected' : ''; 
                                echo "<option value='$k' $is_selected>$v</option>";
                            }
                            ?> 
                            </select>　　
                            签证目的：<select id='visa_purpose'>
                            <?
                            foreach($visa_purpose_array as $k=>$v) {
                                if(isset($_GET['visa_purpose'])) { // 优先从首页指定的选择
                                    $_SESSION['visa_purpose'] = $_GET['visa_purpose'];  
                                }
                                $is_selected = ($_SESSION['visa_purpose'] == "$k") ? 'selected' : ''; 
                                echo "<option value='$k' $is_selected>$v</option>";
                            }
                            ?> 
                             </select>
                            </td></tr>
                        <tr><td style="font-size: 15px;">
                            <br>
                            【当前选定国家】：<span id="selected_country" style="color:blue">
                            <? 
                            if(isset($_SESSION['country_cn_names'])) {
                                echo str_replace(",", " ", $_SESSION['country_cn_names']);
                            } else {
                                echo "<font color=gray>暂无</font>";  
                            }
                            ?>
                            </span> 
                        </td></tr>
                     </TABLE>

					<TABLE cellSpacing=1 style="background:white;border:#eeeeee 5px solid;width:700px;margin:auto;">
					 <TR>
						<TD height=30 align=center colspan=2>
						快速查找:　<input type=text id="quick_search">
						</TD>
					 </TR> 
					 <TR>
						<TD height=30 align=center nowrap="nowrap">【亚洲】：</td><td align="left"> <? show_countries_by_area($countries, '亚洲', 1); ?> 
						</TD>
					 </TR> 
					 <TR>
						<TD height=30 align=center>【欧洲】：</td><td align="left"><? show_countries_by_area($countries, '欧洲', 2); ?>
						</TD>
					</TR>
					<TR>
						<TD height=30 align=center>【美洲】：</td><td align="left"><? show_countries_by_area($countries, '美洲', 3); ?> 
						   </TD>
					 </TR>
					<TR>
						<TD height=30 align=center>【非洲】：</td><td align="left"><? show_countries_by_area($countries, '非洲', 4); ?> 
						</TD>
					 </TR>
					  <TR>
						<TD height=30 align=center>【澳洲】：</td><td align="left"><? show_countries_by_area($countries, '大洋洲', 5); ?> 
						</TD>
					 </TR>
					  <TR>
						<TD height=30 align=center colspan=2>
						<div id="main_schengen_div" style="display: none;">您当前选择中包含多个申根国家，
						<select name='main_schengen_country' id="main_schengen_country">
							<option value='' selected="selected">-请选择-</option>
							<?
							if(isset($_SESSION['country_schengen_names']))  {
								$arr = explode(",", $_SESSION['country_schengen_names']);
								foreach($arr as $v) {
									if(empty($v)) continue;
									echo "<option value='$v'>$v</option>";
								}
							}
							?> 
						</select>
						其中一个作为主申根国</div> <br>
						<input type="button" value="清除重选" onclick="clear_selected()">   
						<input type="button" value="确认选择" onclick="confirm_selected()"><br>
					   
						</TD>
					 </TR> 
					 </TABLE>
</form>
<script>
var f = document.form; 
var country_ids = [<?=$_SESSION['country_ids']?>];  // 选择国家id列表
var country_cn_names = ['<?=implode("','", explode(',', $_SESSION['country_cn_names']))?>'];  // 这里会生成一个空元素，下方有处理掉
var country_short_names = ['<?=implode("','", explode(',', $_SESSION['country_short_names']))?>'];  
var country_schengen_names = ['<?=implode("','", explode(',', $_SESSION['country_schengen_names']))?>'];  // 保存申根国家名 

function select_country(id, cn_name, short_name, is_schengen) {
    var visa_type = $('#visa_type').val(); 
    if((","+country_ids.join(",")+",").indexOf(","+id+",") < 0) {
        if(visa_type == "one") {
           country_ids[0] = id;
           country_cn_names[0] = cn_name;
           country_short_names[0] = short_name;
           $("#selected_country").html(cn_name);  
            
        } else if(visa_type == "many"){
           country_ids.push(id);
           country_cn_names.push(cn_name);
           country_short_names.push(short_name);
           $("#selected_country").append(" "+cn_name);
        } else {
            alert("暂不支持特殊签证办理！");
        }
        if(is_schengen == 1) { // 多国签证时，要处理主签证国的选择
            country_schengen_names.push(cn_name);
            var size = f.main_schengen_country.options.length;
            f.main_schengen_country.options[size] = new Option(cn_name, cn_name);
        }     
        save_selected(); // 将当前选择状态存入后台Session
    } else {
        alert("["+cn_name+"]已经处于选择列表中！");
    }
}  

function clear_selected() {
    country_ids = [];
    country_cn_names = [];   
    country_short_names = [];
    country_schengen_names = [];
    $("#selected_country").html('');
    $('#main_schengen_div').hide();
    f.main_schengen_country.options.length = 1;
    $.get('user/save_countries/clear'); 
}

function confirm_selected() {
    if(country_ids.length == 0) {
        alert("请选择签证目的国家！");
        return false;
    }
    if($('#visa_type').val()=='many' && country_schengen_names.length>1 && f.main_schengen_country.value=='') {
        $('#main_schengen_div').show('slow'); // 多国签证：含多个申根国家，则显示主签证国的选择提示   
        return false;
    } 
    save_selected();
    <?if(isset($_SESSION['current_card_id'])) {?>
    window.location = "<?=base_url()?>user/show_forms/<?echo $_SESSION['current_card_id']?>";
    <?} else {?>
    window.location = "<?=base_url()?>user/show_forms";
    <?}?>
}

function save_selected() {
    var params = {
         'province_name' : $('#province_name').val(),
         'visa_type' : $('#visa_type').val(), 
         'visa_purpose' : $('#visa_purpose').val(), 
         'country_ids' : country_ids.join(","),
         'main_schengen_country' : $('#main_schengen_country').val(),  
         'country_cn_names' : country_cn_names.join(","),
         'country_short_names' : country_short_names.join(","),
         'country_schengen_names' : country_schengen_names.join(",")   
    }
    $.post('user/save_countries', params);
}

function show_more_countries(i, tag) {
    if($(tag).html() == '更多') {
       $('#more_countries_'+i).show('slow'); 
       $(tag).html('关闭');
    } else {
       $('#more_countries_'+i).hide('slow');    
       $(tag).html('更多');
    }
}


$(function() {
        $("#quick_search").autocomplete("<?=base_url()?>user/quick_search_country", {
                minChars: 0,
                width: 500,
                matchContains: "word",
                autoFill: false,
                formatItem: function(row, i, max) {
                    var arr = (row+"").split(",");
                    return i + "/" + max + ": " + arr[1] + '['+ arr[2] +']';
                },
                formatMatch: function(row, i, max) {
                    return row;
                },
                formatResult: function(row) {
                    var arr = (row+"").split(",");
                    return arr[1];
                }
            });

            $("#quick_search").result(function(event, data, formatted){
                var arr = (formatted+"").split(",");
                var country_id = arr[0];
                var country_cn_name = arr[1];
                var country_short_name = arr[2];
                var country_is_schengen = arr[3];
                select_country(country_id, country_cn_name, country_short_name, country_is_schengen);
            }); 
            
            if(country_ids.length == 0) {
                // 尚未选择任何国家时，将以下三个字符串数组清空．去掉第一个空元素
                country_cn_names = [];   
                country_short_names = [];
                country_schengen_names = [];
            }
            
});
</script>
</div>
<?=$this->load->view('user_include_bottom',null)?>     